<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title>系统参数设置</title>
    <link href="../../vendors/iview/css/iview.css" rel="stylesheet"/>
    <link href="../../styles/common.css" rel="stylesheet"/>
    <link href="../../styles/systemSet.css" rel="stylesheet"/>
    <link href="../../styles/company.css" rel="stylesheet"/>

</head>
<body style="overflow: hidden;">

<!--公司客户内容自适应-->
<div id="app" v-cloak style="height: 100%;">

    <table-pannel></table-pannel>
</div>


<!--组件 表格内容-->
<script type="text/x-template" id="table-pannel-template" v-cloak>
    <div style="height: 100%;padding-bottom: 80px;">
        <div class="Add-position">
            <button type="primary" @click="showAdd">添加部门</button>
        </div>
        <div class="position_table">

            <i-table :columns="columnsData" :data="tableData"></i-table>

            <Modal
                    v-model="addPosition"
                    title="编辑部门"
                    :mask-closable="false"
                    width="340"
                    loading
                    ok-text="保存"
                    @on-ok="handleSave"
                    @on-cancel="handleCancel"
                    class-name="vertical-center-modal addPositionWrap-one">
                <spin v-if="saveLoading" size="large" class="load-spin" fix>
                    <icon type="load-c" size=18 class="save-staff-loading"></icon>
                    <div>保存中...</div>
                </spin>
                <div class="Add-position_box">
                    <ul class="position-ul">
                        <li class="position-li">
                            <span class="zymrjsthere">编辑上级部门</span>
                            <div class="zymrjs-tow">
                                <Cascader :data="tableData" v-model="tempEditData" change-on-select></Cascader>
                            </div>
                        </li>
                        <li class="position-li">
                            <span class="zymrjs">部门名称</span>
                            <div class="zymrjs_input">
                                <input type="text" v-model="departmentName">
                            </div>

                        </li>
                        <li class="position-li">
                            <span class="zymrjs">个税</span>
                            <radio-group v-model="taxModel">
                                <radio :label="true">是</radio>
                                <radio :label="false">否</radio>
                            </radio-group>
                        </li>
                        <li class="position-li">
                            <span class="zymrjs">全勤</span>
                            <radio-group v-model="regularityModel">
                                <radio :label="true">是</radio>
                                <radio :label="false">否</radio>
                            </radio-group>
                        </li>
                        <li class="position-li">
                            <span class="zymrjs">佣金</span>
                            <radio-group v-model="commissionModel">
                                <radio :label="true">是</radio>
                                <radio :label="false">否</radio>
                            </radio-group>
                        </li>
                    </ul>
                </div>
            </Modal>


            <!--删除部门弹框-->
            <div class="deletepost">
                <Modal
                        title="删除部门"
                        v-model="deletePos"
                        :mask-closable="false"
                        width="360"
                        ok-text="确认"
                        @on-cancel="取消"
                        @on-ok="handleDelOk"
                        class-name="vertical-center-modal deleteWrap">
                    <div class="delete-position">
                        <ul class="delete-ul">
                            <h3 class="warning">确认将该部门删除吗？</h3>
                        </ul>
                    </div>
                </Modal>
            </div>
        </div>
    </div>
</script>
<script src="../../vendors/require.js"></script>
<script>
    require.config({
        paths: {
            'jquery': '../../vendors/jquery',
            'vue': '../../vendors/vue/vue',
            'iview': '../../vendors/iview/js/iview',
            'table-col-collapse':'../../components/table-col-collapse/table-col-collapse',
            'api':'../../api/api-config',
            'CryptoJS':'../../vendors/crypto-js',
            'departmentManage':'js/department-manage'
        }
    });
    require(['departmentManage'],function (departmentManage) {

    })
</script>

</body>
</html>
